{extend name="../../base/view/common/base" /}
<!-- 主体 -->
{block name="body"}
<div class="p-3">
    <form class="layui-form gg-form-bar border-x" lay-filter="barsearchform" id="barsearchform">
        <!--		<div class="layui-input-inline" style="width:150px;">-->
        <!--			<select name="type">-->
        <!--				<option value="">选择审批类别</option>-->
        <!--				{volist name="type" id="vo"}-->
        <!--				<option value="{$vo.id}">{$vo.title}</option>-->
        <!--				{/volist}-->
        <!--			</select>-->
        <!--		</div>-->
        <div class="layui-input-inline" style="width:150px;">
            <input type="text" name="username"  placeholder="选择申请人" class="layui-input picker-one" readonly>
            <input type="text" name="uid" value="" style="display:none" />
        </div>
        <div class="layui-input-inline" style="width:300px;">
            <select name="status" >
                <option value=""></option>
                <option value="1">未阅</option>
                <option value="2">已阅</option>
            </select>
        </div>
<!--        <div class="layui-input-inline" style="width:300px;">-->
<!--            <select name="check_status" id="">-->
<!--                <option value="">审批结果</option>-->
<!--                {foreach ['草稿','审核中','已通过','已拒绝','已撤销'] as $k=>$v}-->
<!--                <option value="{$k}">{$v}</option>-->
<!--                {/foreach}-->
<!--            </select>-->
<!--        </div>-->
        <div class="layui-input-inline" style="width:150px;">
            <button class="layui-btn layui-btn-normal" lay-submit="" lay-filter="webform"><i class="layui-icon layui-icon-search mr-1"></i>搜索</button>
            <button type="reset" class="layui-btn layui-btn-reset" lay-filter="reset">清空</button>
        </div>
    </form>
    <table class="layui-hide" id="test" lay-filter="test"></table>
</div>
<script type="text/html" id="toolbarDemo">
    <a href="javascript:" class="layui-btn layui-btn-normal" lay-event="plRead">批量阅读</a>
    {if $isDbs!=0}
    <a href="{:url('/home/index/main')}" class="layui-btn layui-btn-normal">返回</a>
    {/if}
</script>
{/block}
<!-- /主体 -->

<!-- 脚本 -->
{block name="script"}
<script>
    const moduleInit = ['tool','employeepicker','laydatePlus'];
    function gouguInit() {
        var form = layui.form,table = layui.table, tool = layui.tool ,element=layui.element,laydatePlus = layui.laydatePlus;

        //日期范围
        var apply_time = new laydatePlus({'target':'apply_time'});

        layui.laydate.render({
            elem:"#bTime"
        })
        layui.laydate.render({
            elem:"#eTime"
        })
        element.on('tab(tab)', function(data){
            $("#barsearchform")[0].reset();
            layui.pageTable.reload({where:{status:data.index},page:{curr:1}});
            $('[name="status"]').val(data.index);
            return false;
        });

        //监听搜索提交
        form.on('submit(webform)', function(data) {
            layui.pageTable.reload({
                where: data.field,
                page: {curr: 1}
            });
            return false;
        });
        $('[lay-filter="clear"]').on('click',function(){
            setTimeout(function(){
                $('[lay-filter="webform"]').click();
            },10)
        });

        layui.pageTable = table.render({
            elem: '#test'
            ,toolbar: '#toolbarDemo'
            ,defaultToolbar: false
            ,title:'审批列表'
            ,url: "{:url('index')}?isDbs={$isDbs}"
            ,page: true //开启分页
            ,limit: 20
            ,cellMinWidth: 80
            ,cols: [[
                {type: 'checkbox', fixed: 'left' },
                {field:'id',width:80, title: 'ID号', align:'center'}
                ,{field:'createUser',title: '申请人',align:'center'}
                ,{field:'spTitle',title: '审批类型',align:'center'}
                ,{field:'check_status', title: '审批结果',align:'center',templet: function(d){
                        var htmlArray = ['<span style="color:#666666">待审批</span>','<span style="color:#4285f4">审批中</span>','<span style="color:#34a853">已通过</span>','<span style="color:#FF5722">已拒绝</span>','<span style="color:#fbbc05">已撤销</span>'];
                        return htmlArray[d.check_status];
                    }}
                ,{field:'read_time',title: '状态',templet:function (d) {
                    if (parseInt(d.read_time)>0){
                        return '已阅';
                    }else {
                        return '未阅'
                    }
                    }}
                ,{width:60,fixed: 'right',title: '操作', align:'center',templet: function(d){
                	var btn='<a class="layui-btn layui-btn-xs" lay-event="view">详情</a>';
                	return btn;
                }}
            ]]
        });

        table.on('tool(test)',function (obj) {
        	if(obj.event === 'view'){
        		tool.side("{:url('info')}?id="+obj.data.id);
        	}
        });
        table.on('toolbar(test)', function(obj){
            var checkStatus = table.checkStatus(obj.config.id);
            console.log(checkStatus)
            switch(obj.event){
                case 'plRead':
                    var data = checkStatus.data;
                    var ids=[]
                    if (data.length){
                        data.forEach(function (value,index) {
                            console.log('value',value)
                            ids.push(value.id)
                        })
                      httpRequest("{:url('readed')}",{id:ids.join(',')},function (res) {
                          if (res.code==0){
                              layui.pageTable.reload()
                          }
                      })

                    }else {
                        layer.msg('请选择数据');
                    }

                    break;

            };
        })
    }
</script>
{/block}
<!-- /脚本 -->